import React from 'react'
import { Card, Button, Table, Divider, Row, Col, Modal, Form, Input } from 'antd'
import DescriptionList from 'components/DescriptionList'
import styles from './index.less'
import {
  contractOrderType,
  productType,
  contractOrderStatus,
  contractActionType,
  contractChangeType,
  contractChangeBusinessType,
  contractChangeReason
} from 'utils/enumConfig'
import moment from 'moment'

const FormItem = Form.Item

const AuditModal = ({
                      currentItem, dispatch, form: {
    getFieldDecorator,
    validateFields,
    setFieldsValue,
  }, ...auditModalProps
                    }) => {
  const {Description} = DescriptionList

  const formItemLayout = {
    labelCol: {
      xs: {span: 8, offset: 0},
      sm: {span: 8, offset: 0},
    },
    wrapperCol: {
      xs: {span: 8, offset: 0},
      sm: {span: 8, offset: 0},
    },
  }

  const toAudit = () => {
    validateFields((err, values) => {
      if (!err) {
        dispatch({
          type: 'orderCancel/accept',
          payload: values
        })
        setTimeout(() => {
          dispatch({
            type: 'orderCancel/query',
            payload: {}
          })
        }, 1000)
      }
    })
  }

  const toDeny = () => {
    validateFields((err, values) => {
      values.version = currentItem.version
      if (!err) {
        dispatch({
          type: 'orderCancel/deny',
          payload: values
        })
        setTimeout(() => {
          dispatch({
            type: 'orderCancel/query',
            payload: {}
          })
        }, 1000)
      }
    })
  }

  const toCancel = () => {
    dispatch({
      type: 'orderCancel/hideModal',
      payload: {}
    })
  }

  /** @namespace currentItem.contractChangeReason */
  /** @namespace currentItem.cancelReason */
  /** @namespace currentItem.creatorName */
  return (
    <div>
      <Modal {...auditModalProps}>
        <Card className={styles.card} bordered={false}>
          <DescriptionList size="large"
                           title="审核合同变更"
                           style={{marginBottom: 32}}>
            <Description term="合同编号">{currentItem.contractNum}</Description>
            <Description term="合同类型">{contractOrderType[(currentItem.contractOrderType)]}</Description>
            <Description term="产品类型">{productType[(currentItem.productType)]}</Description>
            <Description term="取消原因">{currentItem.cancelReason}</Description>
            <Description term="创建者姓名">{currentItem.creatorName}</Description>
          </DescriptionList>
        </Card>
        <Row>
          <Col span={24}>
            {getFieldDecorator('id', {
              initialValue: currentItem.id,
            })(<Input type='hidden'/>)}

            {getFieldDecorator('version', {
              initialValue: currentItem.version,
            })(<Input type='hidden'/>)}

            <FormItem {...formItemLayout} hasFeedback label='审核备注'>
              {getFieldDecorator('auditRemark', {
                rules: [{required: true, message: '审核备注必须填写!'}],
              })(<Input/>)}
            </FormItem>
          </Col>
        </Row>
        <Row type="flex" justify="center">
          <Col span={2}>
            <Button type="primary" onClick={() => toAudit()}>审核通过</Button>
          </Col>
          <Col span={2}>
            <Button type="primary" onClick={() => toDeny()}>审核不通过</Button>
          </Col>
          <Col span={2}>
            <Button onClick={() => toCancel()}>取消</Button>
          </Col>

        </Row>
      </Modal>
    </div>
  )
}

export default Form.create()(AuditModal)
